﻿<style>
    .input {
        height: 30px;
        border: 0.5px solid rgba(224, 224, 224, 0.71);
        margin-left: 2px;
        margin-top: 1px;
    }

    .icon1 {
        color: #4995ff;
        font-weight: 800;
        margin-left: 3px;
    }

    .icon11 {
        color: #ff6a00;
        font-weight: 800;
    }

    .icon2 {
        color: red;
        font-size: 12px;
        font-weight: 800;
        margin-left: 5px;
    }

    .s1 {
        background-color: #e8e8e8;
        border: 2px solid #e8e8e8;
        border-radius: 5px;
        margin-left: 2px;
        margin-right: 2px;
    }

    .s2 {
        margin-left: 6px;
        margin-right: 2px;
        color: #b4b4b4;
        cursor: pointer;
    }
</style>
<div class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list" style="padding: 20px 30px 0 0;">

    <fieldset class="layui-elem-field layui-field-title">
        <legend>基础信息</legend>
    </fieldset>
    <script type='text/html' template lay-done='layui.data.formdone(d.params);'>
        <input type='hidden' name='PID' id="PID" value="{{ d.params.PID || '' }}" />
    </script>
    <input type='hidden' name='Specs' id="Specs" />
    <input type='hidden' name='Params' id="Params" />
    <input type='hidden' name='Brands' id="Brands" />
    <div class='layui-form-item'>
        <label class='layui-form-label'>名称<label style="color: red">*</label></label>
        <div class='layui-input-inline' style="width:420px;">
            <script type='text/html' template>
                <input type='text' name='Name' value='{{ d.params.Name || '' }}' lay-verify='required' placeholder='名称' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>

    <!--<div class='layui-form-item'>
        <label class='layui-form-label'>上级分类</label>
        <div class='layui-input-inline' style="width:420px;">
            <script type='text/html' template lay-done='layui.data.getSelSource(d.params,"ParentID_SelSource");'>
                <input type="hidden" id="ParentID_SelSource" name="ParentID_SelSource" value="{{ d.params.ParentID_SelSource || '' }}" />
                <input type="hidden" id="ParentID_SelSourceName" name="ParentID_SelSourceName" value="{{ d.params.ParentID_SelSourceName || '' }}" />
                <select name="select1" xm-select="select1" xm-select-radio="" xm-select-search="" xm-select-skin="default">
                    <option value=""></option>
                </select>
            </script>
        </div>
    </div>-->

    <div class='layui-form-item'>
        <label class='layui-form-label'>图片</label>
        <div class='layui-input-inline' style="width:80%">
            <div class="layui-upload">
                <button type="button" class="layui-btn" id="selectImg">选择图片</button> &nbsp;&nbsp;<!--<span style="color:#c2c2c2">下级分类需上传图片</span>-->
                <script type='text/html' template lay-done='layui.data.getSelSource(d.params,"divImgs");'>
                     <div class="layui-upload-list" id="divImgs"></div>
                </script>
                <script type='text/html' template lay-done='layui.data.setUploads(d.params);'>
                    <input type="hidden" name="Path_Upload" id="Path_Upload" value="{{ d.params.Path_Upload || '' }}">
                </script>
                <hr />
            </div>
        </div>
    </div>

    <div class='layui-form-item'>
        <label class='layui-form-label'>简介</label>
        <div class='layui-input-inline' style="width:420px;">
            <script type='text/html' template>
                <input type='text' name='Introduction' value='{{ d.params.Introduction || '' }}' placeholder='简介' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>
    <div class='layui-form-item'>
        <label class='layui-form-label'>说明</label>
        <div class='layui-input-inline' style="width:420px;">
            <script type='text/html' template>
                <input type='text' name='RMK' value='{{ d.params.RMK || '' }}' placeholder='说明' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>
    <!--<div class='layui-form-item'>
        <label class='layui-form-label'>其他</label>
        <div class='layui-input-inline'>
            <script type='text/html' template>
                <input type='text' name='Other1' value='{{ d.params.Other1 || '' }}' placeholder='其他' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>
    <div class='layui-form-item'>
        <label class='layui-form-label'>其他</label>
        <div class='layui-input-inline'>
            <script type='text/html' template>
                <input type='text' name='Other2' value='{{ d.params.Other2 || '' }}' placeholder='其他' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>-->
    <div class='layui-form-item'>
        <label class='layui-form-label'>排序</label>
        <div class='layui-input-inline' style="width:420px;">
            <script type='text/html' template>
                <input type='text' name='Sort' value='{{ d.params.Sort || '0' }}' lay-verify='number' placeholder='排序' autocomplete='off' class='layui-input'>
            </script>
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label"></label>
        <div class="layui-input-inline">
            <input type="button" lay-submit lay-filter="layuiadmin-app-form-submit" value="确认" class="layui-btn">
        </div>
    </div>
</div>

<script type="text/javascript">


    layui.data.getSelSource = function (d, sourceName) {
        layui.use(['form', 'admin', 'formSelects'], function () {
            var $ = layui.$;
            var form = layui.form;
            var admin = layui.admin;
            if (sourceName == "divImgs") {
                if (d.Path_Upload) {
                    var Image = d.Path_Upload.replace(/\[|]/g, "");
                    if (Image != null && Image != "" && Image != undefined) {
                        var sanImage = Image.split(",");
                        var niu = "";
                        if (sanImage.length > 1) {
                            for (var i = 0; i < sanImage.length; i++) {
                                addImg({ name: JSON.parse(sanImage[i]), path: layui.setter.ImgPath + JSON.parse(sanImage[i]) });
                            }
                        } else {
                            addImg({ name: JSON.parse(Image), path: layui.setter.ImgPath + JSON.parse(Image) });
                        }
                    }
                }


            }


            //if (sourceName == "ParentID_SelSource") {

            //    var formSelects = layui.formSelects;
            //    formSelects.config('select1', {
            //        keyName: 'title',            //自定义返回数据中name的key, 默认 name
            //        keyVal: 'id',            //自定义返回数据中value的key, 默认 value
            //        keyChildren: 'children',    //联动多选自定义children
            //    });

            //    //admin.req({
            //    //    url: layui.setter.APIUrl + '/shop/goodscategoryMgr/customerQueryChildren', //实际使用请改成服务端真实接口
            //    //    type: 'post',
            //    //    done: function (res) {
            //    //        layui.formSelects.data('select1', 'local', {
            //    //            arr: res.Data,
            //    //            //linkage: true,
            //    //            //linkageWidth: 130
            //    //        });
            //    //        var selID = d.ParentID_SelSource;
            //    //        //如果有需要默认值的小伙伴请使用formSelects.value
            //    //        formSelects.value('select1', [selID]);
            //    //    }
            //    //});

            //    formSelects.on('select1', function (id, vals, val, isAdd, isDisabled) {
            //        if (isAdd == true) {
            //            $("#ParentID_SelSource").val(val.value);
            //        } else {
            //            $("#ParentID_SelSource").val("");
            //        }
            //        //Specs = new Array();
            //        //Params = new Array();
            //        //Brands = [];
            //        //document.getElementById('divSpecs').innerHTML = '';
            //        //document.getElementById('paramtab').innerHTML = '';
            //        //document.getElementById('brandspan').innerHTML = '';
            //        //var html = "<tr id='trn' style='display:none'><td>参数名</td><td>默认值</td></tr>";
            //        //$("#paramtab").append(html);
            //        //$("#brandNum").text("0");
            //        //$("#Brands").val("");
            //        //LoadSpecParam($("#ParentID_SelSource").val());
            //    });
            //}
        });
    }

    var ImgNum = 0;
    var Images = [];
    layui.data.setUploads = function (d) {
        layui.use(['jquery', 'upload', 'admin'], function () {
            window.jQuery = window.$ = layui.jquery;
            upload = layui.upload,
            admin = layui.admin;
            //多图上传
            var uploadInst = upload.render({
                elem: '#selectImg'
              , url: '/WebAPI/file/uploadImgNew?access_token=' + layui.data('layuiAdmin').access_token
              , acceptMime: 'image/*'
                , multiple: true
                , number: 5
              , done: function (res) {
                  if (res.ResultCode == 0) {
                      addImg(res.Data);
                      layer.msg('上传成功');
                  } else {
                      layer.msg(res.ResultInfo);
                  }
              }
            });
            var pics = d.Path_Upload;
            if (pics != "" && pics != null && pics != 'null') {
                addImg({ name: pics, path: layui.setter.ImgPath + pics });
            }
        })
    }
    function addImg(src) {

        var div = "divimg" + ImgNum;
        var img = "Img" + ImgNum;
        var html = "    <div style=\"line-height:100px;float:left\" id='" + div + "'> " +
            " <a style=\"float:right;line-height:10px;background-color:#ff0000;font-size:24px;color:white;border-top:3px solid #ff0000\" onclick=\"deletp(" + ImgNum + ")\">×</a> " +
            " <img id='" + img + "' src=\"" + src.path + "\" width='80' height='80'  alt=\"\" class=\"layui-upload-img\">" +
            "</div>";
        $('#divImgs').append(html);
        Images.push(src.name);
        $("#Path_Upload").val(JSON.stringify(Images));
        ImgNum++;
    }
    function deletp(num) {

        var div = "divimg" + num;
        for (var i = 0; i < Images.length; i++) {
            if ((layui.setter.ImgPath + Images[i]) == $("#Img" + num + "").attr("src")) {
                Images.splice(i, 1);
            }
        }
        var divImg = document.getElementById(div);
        divImg.parentNode.removeChild(divImg);

        $("#Path_Upload").val(JSON.stringify(Images));
    }



    //function addImg(src) {
    //    var div = "divimg3";
    //    var img = "Img3";
    //    var html = "    <div style=\"line-height:100px;float:left\" id='" + div + "'> " +
    //                       " <a style=\"float:right;line-height:10px;background-color:#ff0000;font-size:24px;color:white;border-top:3px solid #ff0000\" onclick=\"deletp3()\">×</a> " +
    //                       " <img id='" + img + "' src=\"" + src.path + "\"   alt=\"\" class=\"layui-upload-img\">" +
    //                   "</div>";
    //    $('#divImgs').html(html);
    //    $("#Path_Upload").val(src.name);
    //}
    ////删除图片
    //function deletp3() {
    //    $('#divImgs').html("");
    //    $("#Path_Upload").val("");
    //}




    layui.use(['form', 'admin', 'upload', 'jquery'], function () {
        var form = layui.form;//required（必填项）phone（手机号）email（邮箱）url（网址）number（数字）date（日期）identity（身份证） 自定义值
        window.jQuery = window.$ = layui.jquery;

    });



    layui.data.formdone = function (d) {
        //LoadSpecParam(d.PID);
    }

</script>
